# Tarjeta / Card / Tile

### Código

```
<tile></tile>
```

### Tokens

**Color**

| Class                        | Property         | Color token |
| :--------------------------- | :--------------- | :---------- |
| `.bx--tile`                  | background-color | `$ui-01`    |
| `.bx--tile:focus`            | border           | `$focus`    |
| `.bx--tile:hover`            | background-color | `$hover-ui` |
| `.bx--tile--is-selected`     | border           | `$ui-05`    |
| `.bx--tile__chevron`         | svg              | `$icon-01`  |
| `.bx--tile__checkmark`       | svg              | `$icon-01`  |
| `.bx--tile__checkmark:hover` | svg              | `$icon-02`  |

**Estructura**

| Class       | Property          | Spacing token |
| :---------- | :---------------- | :------------ |
| `.bx--tile` | min-height        | –             |
| `.bx--tile` | min-width         | –             |
| `.bx--tile` | padding (minimum) | `$spacing-05` |